SF33843
3 jours
Formation RGAA : développer des sites web accessibles.
Comprendre et appliquer les principes du référentiel RGAA pour développer des sites web accessibles !
Maîtrisez l'art du développement web accessible avec notre formation sur le référentiel RGAA. Sur 3 jours, cette formation immersive vous prépare à comprendre, tester et implémenter les standards d'accessibilité web selon le RGAA. Conçue pour les développeurs et les professionnels IT, elle offre un mélange équilibré de théorie, d'exemples pratiques et d'ateliers pour assurer une compréhension approfondie et une application immédiate des principes d'accessibilité dans vos projets web.
Programme de formation RGAA : développer des sites web accessibles.
PDFIntroduction à l’accessibilité web
Définitions clés : accessibilité numérique, inclusion
Types de handicaps et problématiques d’usage
Statistiques d’audience et bénéfices UX/SEO
Exemple d’activité pratique :
Quiz interactif : repérer les freins d’un parcours utilisateur mal conçu
Cadre légal & référentiels
Loi française 2005-102, décret 2019-768, Directive UE 2016/2102
RGAA 4.2 et cartographie avec WCAG 2.2
Échéance du 28 juin 2025 : obligations, sanctions, registre public d’accessibilité
Exemple d’activité pratique :
Étude de cas : analyse d’un contrôle DGCCRF et de son impact financier
Anatomie d’une page web accessible
Structure HTML5 : balises sémantiques, hiérarchie des titres
Repères ARIA landmarks & navigation par régions
Ordre logique vs. rendu visuel
Exemple d’activité pratique :
Refonte guidée : restructurer l’en-tête et le corps d’une page existante
Outils d’évaluation & premiers tests
Inspecteurs d’accessibilité navigateur (Firefox/Chrome)
Lecteurs d’écran (NVDA, VoiceOver) & modes de navigation
Extensions RGAA & grilles de contrôle
Exemple d’activité pratique :
Prise en main : exécuter 10 tests rapides sur un site choisi par le groupe
HTML sémantique avancé
Bonnes pratiques : listes, citations, abréviations, images (attribut alt)
Tableaux complexes : headers, summaries, associations cellules/en-têtes
Exemple d’activité pratique :
Mini-challenge : rendre accessible une galerie d’images et un tableau de données
CSS et perception visuelle
Contrastes (méthodes de calcul RGAA)
Indicateurs de focus visibles et personnalisés
Contenus masqués (clip-path, sr-only) & animation réduite
Exemple d’activité pratique :
Test couleur : corriger les erreurs d’un thème sombre et de ses états focus
Navigation clavier & liens
Ordre tabulation, liens d’évitement, scroll automatique
Texte de lien pertinent et images-liens composées
Exemple d’activité pratique :
Implémentation : créer un menu de navigation 100 % clavier + lecteur d’écran
Formulaires accessibles
Association label / input, fieldset / legend
Messages d’erreur, aria-invalid, aria-describedby
Contrôle de saisie temps réel & device-indépendant
Exemple d’activité pratique :
Atelier : concevoir un formulaire complexe (multi-étapes) et sa validation ARIA
WAI-ARIA : principes et limites
Rôles, états, propriétés, live regions
Patterns officiels : accordion, tablist, dialog…
Bonnes pratiques : “No ARIA is better than bad ARIA”
Exemple d’activité pratique :
Exercice : transformer un composant modal JS en dialog ARIA conforme
Contenus dynamiques & SPA
Gestion du focus après mise à jour DOM
Notifications non intrusives (aria-live, assertive/polite)
Limites de temps & préférences médias réduits
Exemple d’activité pratique :
Code lab : ajouter une zone d’alerte live à un tableau filtré dynamiquement
Nos autres formations en Développement Front-End .
Formation Angular
Formation Angular Avancé
Formation Bootstrap 5
Formation D3.js
Formation Ergonomie logicielle
Formation HTML et CSS
A travers sa Charte Engagement Qualité, Sparks s’engage à tout mettre en œuvre pour que chaque session de formation soit un succès et que votre satisfaction soit totale.
